<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>vue自定义指令</title>
	<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>

</head>
<body>
	<div id="app">
		<input v-focus value="自定义指令v-focus" >
	</div>
	<script type="text/javascript" >
		//注册全局自定义指令v-focus
		// Vue.directive('focus', {
		// 	//当被绑定元素插入到dom时触发
		// 	inserted:function(el){
		// 		el.focus()
		// 	}
		// })
		new Vue({
			el:'#app',
			//局部自定义指令
			directives: {
			  focus: {
			    // 指令的定义
			    inserted: function (el,binding,vnode,oldVnode) {
			      el.focus()
			      console.log(binding)
			    }
			  }
			}
		})
/*		bind：只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。

		inserted：被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。

		update：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变，也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新 (详细的钩子函数参数见下)。

		componentUpdated：指令所在组件的 VNode 及其子 VNode 全部更新后调用。

		unbind：只调用一次，指令与元素解绑时调用。*/
	</script>
</body>
</html>